/*
 * @Author: 橘子
 * @Date: 2022-11-26 17:14:25
 * @Project_description: 组件
 * @Description: 代码是我抄的，不会也是真的
 */
export default [
  {
    //   标题
    title: 'pdf预览',
    //   标签
    tag: 'components',
    // 位置
    path: 'components/y-dpf',
    //   方法
    fun: 'null',
    // 完整code
    code: `
        <y-pdf  ref='pdf' />
        // 网络路径
        $refs.pdf.init(url)
        `,
  },
  {
    //   标题
    title: '表格导入',
    //   标签
    tag: 'components',
    // 位置
    path: 'components/y-import-exl',
    //   方法
    fun: 'null',
    // 完整code
    code: `
        //点击确定导入@click
        //下载空模板@uploadTemplate({ header, results })
        <y-import-exl  @click='import'  @uploadTemplate='uploadTemplate' />
        `,
  },
  {
    //   标题
    title: '头像',
    //   标签
    tag: 'components',
    // 位置
    path: 'components/y-image',
    //   方法
    fun: 'null',
    // 完整code
    code: `
        <y-image   width=''   height=''  v-model='src路径' />
        `,
  },
  {
    //   标题
    title: '图片上传',
    //   标签
    tag: 'components',
    // 位置
    path: 'components/y-upload-img',
    //   方法
    fun: 'null',
    // 完整code
    code: `
          <y-upload-img v-model='form.avatarImg'   :limit='1' />
        `,
  },
  {
    //   标题
    title: '百度地图',
    //   标签
    tag: 'components',
    // 位置
    path: 'components/y-map',
    //   方法
    fun: 'this.$refs.map.show=true',
    // 完整code
    code: `
          <y-map @emit='(经纬度,地址名称) => ()'  :location='{lng:0,lat:0}'  center='渭南'   addr='陕西省渭南市'  ref='map'/>
        `,
  },
  {
    //   标题
    title: '富文本',
    //   标签
    tag: 'components',
    // 位置
    path: 'components/y-editor',
    //   方法
    fun: 'Null',
    // 完整code
    code: `
          <y-editor :value='value' @onChange='onChange'/>
        `,
  },
  {
    //   标题
    title: '高德地图',
    //   标签
    tag: 'components',
    // 位置
    path: 'Avue',
    //   方法
    fun: 'Null',
    // 完整code
    code: `
         <!-- 导入需要的包 （一定要放到index.html中的head标签里） -->
<!-- 高德地图api更新必须配合安全密钥使用 -->
<script>
  window._AMapSecurityConfig = {
    securityJsCode: 'xxxxx',
  }
</script>
<script type="text/javascript" src='https://webapi.amap.com/maps?v=1.4.11&key=xxxxxxxx&plugin=AMap.PlaceSearch'></script>
<script src="https://webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>

        //使用方法
        <avue-input-map  :params="params" placeholder="请选择地图" v-model="form" ></avue-input-map>
        //高德初始化参数
        {
          10,
          // zoomEnable: false,
          // dragEnable: false,
        },
         [ 113.10235504165291, 41.03624227495205, "位置" ] ,
        `,
  },

  {
    //   标题
    title: '摄像头',
    //   标签
    tag: 'components',
    // 位置
    path: 'Avue',
    //   方法
    fun: 'Null',
    // 完整code
    code: `
    <el-button @click='startRecord' v-if='!flag' type='primary'>开始录制</el-button>
    <el-button type='danger' @click='stopRecord' v-else>停止录制</el-button>
    <br /><br />
    <avue-video background='https://avuejs.com/images/face.png' @data-change='dataChange' ref='video'></avue-video>
<script>
export default {
  data(){
    return {
      flag:false
    }
  },
  methods: {
      startRecord() {
        this.flag=true;
        this.$message.success('开始录制')
        this.$refs.video.startRecord();
      },
      stopRecord() {
        this.flag=false;
        this.$message.success('请看控制台视频文件的base64')
        this.$refs.video.stopRecord();
      },
      dataChange(data) {
        //base64
        console.log(data);
      }
    }
}
</script>
        `,
  },
  {
    //   标题
    title: 'icon图标选择',
    //   标签
    tag: 'components',
    // 位置
    path: 'components/y-icon-select',
    //   方法
    fun: 'null',
    // 完整code
    code: `
         //更多用法看组件去
         <y-icon-select v-model='form.avatarImg' />
        `,
  },
  {
    //   标题
    title: '显示备注',
    //   标签
    tag: 'components',
    // 位置
    path: 'components/y-remark',
    //   方法
    fun: 'null',
    // 完整code
    code: `
         //更多用法看组件去
         <y-remark v-model='form.remark' />
        `,
  },

]
